/* Background Color
The background-color property specifies the background color of an element.

The background color of a page is defined in the body selector:

The background color can be specified by:

name - a color name, like "red" 
RGB - an RGB value, like "rgb(255,0,0)" 
Hex - a hex value, like "#ff0000" 
*/



.lightest {font-weight:100}
.lighter {font-weight:200}
.light {font-weight:300}
.normal {font-weight:400}
.heavy {font-weight:500}
.heavier {font-weight:600}
.bold {font-weight:700}
.bolder {font-weight:800}
.boldest {font-weight:900}

.italics {
    font-style:italic;
    }
.heavieritalics {
    font-style:italic;font-weight:600
    }


body {
    background-color: #d0e2e8;
    font-family: Arial, Helvetica, Tahoma, Geneva, Verdana, "Lucidia Sans Unicode", "Lucidia Grande", sans-serif;
    font-size: 80%;
    }
h1, h2, h3, h4, p, li {
    color:rgb(119,119,119);
    }


h1  {
    font-size:1.64em;}
h2  {
    font-size:1.45em;}
h3  {
    font-size:1.18em;}
h4  {
    font-size:1.0em;}

li {
    list-style-type: square;
    }
 

.page  {
    width: 100%;
    text-align:center;
       }

.container {
    width: 940px;
    height: 750px;
    text-align: left;
    border: 5px solid #6C6F70;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    margin-bottom: auto;
    padding: 0px;
    }

.containerLong1 {
    width: 940px;
    height: 1000px;
    text-align: left;
    border: 5px solid #6C6F70;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    margin-bottom: auto;
    padding: 0px;
    }


.containerGallery {
    width: 940px;
    height: 3500px;
    text-align: center;
    border: 5px solid #6C6F70;
    background-color: #ffffff;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    margin-bottom: auto;
    padding: 0px;
    }

.siteHeader {
    width: 940px;
    height: 125px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.siteLogo {
    float: left;
    display: inline;
    width:  275px;
    height: 125px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    text-align: center;
    }

.siteBanner {
    float: left;
    display: inline;
    width: 665px;
    height: 125px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.siteMenu {
    width: 940px;
    height: 28px;
    margin: 0px;
    border-width: 3px;
    border-color:  #6C6F70;
    border-top-style: solid;
    border-bottom-style: solid;
    border-left-style: none;
    border-right-style: none;
    padding: 0px;
    background-color: #aac1c9;
    }

.pageContent {
    width: 900px;
    height: 551px;
    margin: 20px;
    border: 0px;
    padding: 0px;
    }

.homePageTitle {
    position:relative;
    left:150px;
    max-width: 707px;
    max-height: 40px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.pageTitle {
    float:  left;
    display: inline;
    max-width: 707px;
    max-height: 40px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.pageGraphic {
    float: right;
/*    display: inline;  */
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 20px;
    margin-bottom: 20px;
    }

.comfortScript {
    position:relative;
    left:10px;
    width: 309.6px;
    height: 107.2px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.comfortPhrases {
    position:relative;
    left:30px;
    width: 580px;
    height: 107px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.joyScript {
    position:relative;
    left:60px;
    width: 131.2px;
    height: 120px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.joyPhrases {
    position:relative;
    left:90px;
    width: 751px;
    height: 114px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.homeBottomLine {
    position:relative;
    left:150px;
    width: 601px;
    height: 52px;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

.paragraphStartBlock {
    color:#aac1c9;
    font-size:1.25em;
    font-weight:900;
    font-style:italic;
    }

.twoColList {
    border: 0px;
    cellpadding: 0px;
    cellspacing: 0px;
    }

.spacerColumn {
    width: 20px;
    }

.subTopic {
    margin: 10px;
    border: 0px;
    padding: 0px;
    }

.aboutUsContent {
    margin: 25px;
    border: 0px;
    padding: 0px;
    }

.servicesContent {
    margin: 25px;
    border: 0px;
    padding: 0px;
    }

.contactInfoBox {
    margin-left: 120px;
    margin-top: 80px;
    border: 0px;
    padding: 0px;
    }
.photoPortrait {
    width: 300px;
    height: 400px;
    margin: 0px;
    border: 2px;
    padding: 0px;
    }

.photoLandscape {
    width: 400px;
    height: 300px;
    margin: 0px;
    border: 2px;
    padding: 0px;
    }

a:link {                        /* unvisited link */
    color:rgb(119,119,119);
    text-decoration:none;
    }         
a:visited {                     /* visited link */
    color:rgb(119,119,119);
    text-decoration:none;
    }      
a:hover {                      /* mouse over link */
    color:rgb(119,119,119);
    text-decoration:underline;
    }
a:active {                    /* selected link */ 
    color:rgb(119,119,119);
    text-decoration:underline;
    }

a.detailsLabel {
    color:#aac1c9;
    font-size:0.9em;
    font-weight:900;
    }

#welcomeGraphic {
    width: 173px;
    height: 334px;
    }

/* Navigation Menu */

#navlist{position:relative;
    margin: 0px;
    border: 0px;
    padding: 0px;
    }

#navlist li{
    margin:0;
    padding:0;
    list-style:none;
    position:absolute;
    top:0;}

#navlist li, #navlist a{height:28px;display:block;}

/* Navigation Menu Items */

/* HOME menu item - 3 definitions:
       - Position from left & width of menu item
       - Image sprite file, and co-ordinates of target image within the Image sprite file
       - Image sprite file, and co-ordinates of target image to use for hover action
*/
    
#home{
    left:220px;
    width:67px;
    }

#home{
    background:url('images/NavigationSprite.gif') 0 -0px;
    }

#home a:hover{
    background: url('images/NavigationSprite.gif') 0 -28px;
    }

/* ABOUT US menu item - 3 definitions  */

#about{
    left:307px;
    width:108px;
    }

#about{
    background:url('images/NavigationSprite.gif') -67px 0;
    }

#about a:hover{
    background: url('images/NavigationSprite.gif') -67px -28px;
    }

/* SERVICES menu item - 3 definitions  */

#services{
    left:435px;
    width:101px;
    }

#services{
    background:url('images/NavigationSprite.gif') -175px 0;
    }

#services a:hover{
    background: url('images/NavigationSprite.gif') -175px -28px;
    }

/* GALLERY menu item - 3 definitions  */

#gallery{
    left:556px;
    width:87px;
    }

#gallery{
    background:url('images/NavigationSprite.gif') -276px 0;
    }

#gallery a:hover{
    background: url('images/NavigationSprite.gif') -276px -28px;
    }

/* MEDIA menu item - 3 definitions  */

#media{
    left:663px;
    width:65px;
    }

#media{
    background:url('images/NavigationSprite.gif') -363px 0;
    }

#media a:hover{
    background: url('images/NavigationSprite.gif') -363px -28px;
    }

/* contact menu item - 3 definitions  */

#contact{
    left:748px;
    width:98px;
    }

#contact{
    background:url('images/NavigationSprite.gif') -428px 0;
    }

#contact a:hover{
    background: url('images/NavigationSprite.gif') -428px -28px;
    }